<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>纯css正方形</title>
	<style>
	* {
		margin: 0;
		padding: 0;
	}
	body,html {
		width: 100%;
		height: 100%;
		background: red;
	}
		.square {
			width: 50%;
			line-height: 0;
			/*border: 2px solid purple;*/
			margin: 33px auto;
		}
		.square img {
			width: 100%;
			/*visibility: hidden;*/
		}
		.pd {
			width: 50%;
			height: 0px;
			padding-bottom: 50%;
			background-color: red;
		}
	</style>
</head>
<body>
	<div class="square">
		<img src="./img/椭圆-2-拷贝.png" alt="">
	</div>
	<!-- <div class="pd"></div> -->
</body>
</html>